<template>
	<view class="container">
		<uni-collapse accordion>
			<uni-collapse-item :title="item.titleName" style="margin: 10upx 0;" :thumb="item.thumb" v-for="(item,index) in titleList">
				<view class="collapse_box">
					<view class="collapse_text" v-for="(dataItem,dataIndex) in itemList" @click="navTo(dataItem,index)">
						{{dataItem.titleName}}
					</view>
				</view>
			</uni-collapse-item>
		</uni-collapse>
	</view>
</template>

<script>
	import uniCollapse from '@/components/uni-collapse/uni-collapse.vue'
	import uniCollapseItem from '@/components/uni-collapse-item/uni-collapse-item.vue'
	export default {
		data() {
			return {
				tagType:['PARTY','TRANSPARENT','FINANCE'],
				titleList: [
					{
						titleName: "党务公开",
						thumb: "https://cdjjyl.com.cn/images/swgk/dwgk.png"
					}, {
						titleName: "政务公开",
						thumb: "https://cdjjyl.com.cn/images/swgk/zwgk.png"
					}, {
						titleName: "财务公开",
						thumb: "https://cdjjyl.com.cn/images/swgk/cwgk.png"
					},
				],
				itemList: [{
					titleName: "人员公开",
					path: "/pages/public/infoList"
				}, {
					titleName: "管理制度公开",
					path: "/package_isp/pages/threeAffairs/manageSystem"
				}, {
					titleName: "文章公开",
					path: "/package_isp/pages/threeAffairs/infoOpen"
				}]
			}
		},
		components: {
			uniCollapse,
			uniCollapseItem
		},
		onLoad() {

		},
		methods: {
			navTo(data, index) {
				uni.navigateTo({
					url: data.path + '?tagType=' + this.tagType[index] + '&tagName=' + data.titleName
				})
			}

		}
	}
</script>

<style>
	page {
		background-color: #FBFBFB;
	}

	.container {
		width: 100%;
		/* background-color: #FBFBFB; */
		overflow: hidden;
		padding: 32upx;
	}

	.collapse_text {
		padding: 0upx 40upx;
		height: 100upx;
		background-color: #F9F9F9;
		line-height: 100upx;
		font-size: 26upx;
		box-shadow: 2upx 2upx 11upx -1upx rgba(0, 0, 0, 0.2);
		/* border-bottom:2upx dotted #ff0000; */
	}

	.collapse_box {
		/* height: 330upx; */
		overflow: hidden;
		background-color: #FFFFFF;
	}

	.uni-collapse {
		background-color: #fbfbfb !important;
	}

	.uni-collapse-item {
		box-shadow: 2upx 2upx 22upx -2upx rgba(0, 0, 0, 0.1);
	}

	.uni-collapse-item__title {
		background-color: white;
		height: 120upx;
		border-left: 5px solid #E54E4E;
	}

	.uni-collapse-item__title-text {
		margin: 15upx 0;
		line-height: 70upx;
		padding-left: 20upx;
		font-size: 30upx !important;
		font-weight: bold;
		border-left: 1px solid rgba(0, 0, 0, 0.2);
	}

	.uni-collapse-item__wrap {
		background-color: #E7E7E7 !important;
		overflow: hidden;
	}

	.uni-collapse-item__title.uni-collapse-item-border {
		border-bottom: 0 solid #000000 !important;
	}

	.uni-collapse-item__wrap-content.uni-collapse-item--border {
		border-bottom: 0 solid #000000 !important;
	}
</style>
